/*
 * @Description: 通知按钮
 * @Author: Zzt
 * @Date: 2023-02-20 15:49:32
 * @LastEditTime: 2023-02-28 20:14:27
 */
import { fetchNoticeUserById } from '@/api/announcement/noticeUser';
import { Button, Divider, message, Select, Space } from 'antd';
import classNames from 'classnames/bind';
import { useAnnouncementContext } from '../contexts/AnnouncementContext';
import styles from '../styles/operate.module.scss';

const cx = classNames.bind(styles);

const PageOperate = () => {
  const { selectItems, setStatus, status } = useAnnouncementContext();

  const Release = () => {
    if (selectItems.length !== 1) {
      message.warning('请选择一项标记为已读');
    } else {
      // TODO 调用接口
      const params = { id: selectItems[0], status: 2 };
      fetchNoticeUserById({ ...params }).then(setStatus(2));
    }
  };
  const Unread = () => {
    if (selectItems.length === 0) {
      message.warning('请选择一项标记为未读');
    } else {
      // TODO 调用接口
      const params = { id: selectItems[0], status: 1 };
      fetchNoticeUserById({ ...params }).then(setStatus(1));
    }
  };
  const selectValue = (value: any) => {
    setStatus(value);
  };
  return (
    <>
      <div className={cx('operate')}>
        <Space size={'large'}>
          <b>公告列表</b>
          <div>
            查看状态：
            <Select
              onChange={selectValue}
              defaultValue={0}
              value={status}
              style={{ width: 120 }}
              options={[
                {
                  value: 0,
                  label: '全部'
                },
                {
                  value: 2,
                  label: '已读'
                },
                {
                  value: 1,
                  label: '未读'
                }
              ]}
            />
          </div>
        </Space>
        <div>
          <Space>
            <Button onClick={Unread}>设为未读</Button>
            <Button type="primary" onClick={Release}>
              设为已读
            </Button>
            <Divider type="vertical" />
            <Button>筛选检索</Button>
          </Space>
        </div>
      </div>
    </>
  );
};
export default PageOperate;
